import React, { Component } from 'react'
import { connect } from 'react-redux'
import { func } from 'prop-types'

import Posts from '../components/Posts'
import { fetchPosts } from '../modules'

class App extends Component {
  static propTypes = {
    fetchPosts: func,
  }

  componentDidMount() {
    const { fetchPosts } = this.props

    fetchPosts()
  }

  render() {
    const { posts = [] } = this.props

    return (
      <div>
        <Posts posts={posts} />
      </div>
    )
  }
}

const mapStateToProps = state => ({
  posts: state.posts.posts,
})

export default connect(mapStateToProps, {
  fetchPosts,
})(App)
